<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<%--加载jquery--%>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
    $(document).ready(function() {
        // 校验手机号格式
        function validatePhone(phone) {
            var regex = /^1[34578][0-9]{9}$/;
            if (!regex.test(phone)) {
                return false;
            }
            return true;
        }

        // 注册函数
        function register() {
            var phone = $("#phone").val();
            var registerDate = $("#register_date").val();
            if (!validatePhone(phone)) {
                alert("请输入正确的手机号！");
                return;
            }
            $.ajax({
                url: "/register",
                type: "POST",
                data: {phone: phone, register_date: registerDate},
                success: function(response) {
                    if (response.success) {
                        alert("注册成功！");
                        window.location.href = "/login"; // 重定向到登录页面
                    } else {
                        alert("注册失败：" + response.message);
                    }
                }
            });
        }

        // 绑定注册按钮的点击事件
        $("#register_btn").click(register);
    });
</script>
<body>
<h2>首页</h2>

<a href="${pageContext.request.contextPath}/forward">请求转发</a>
<a href="${pageContext.request.contextPath}/servletApi">原生API</a>
<a href="${pageContext.request.contextPath}/redirect">redirect重定向</a>
<a href="${pageContext.request.contextPath}/sendRedirect">原生API重定向</a>
<hr>
<a href="${pageContext.request.contextPath}/requestAPI">原生request存储数据</a>
<a href="${pageContext.request.contextPath}/requestAPI?username=tom">原生request存储数据</a>
<a href="${pageContext.request.contextPath}/modelandview?username=tom&password=111">modelandview</a>
<a href="${pageContext.request.contextPath}/model">model</a>
<hr>
<h2>异步操作</h2>
<button id="btnsend">异步请求</button>

<button id="btnresp">原神账号登录异步响应</button>
<script>
    //1.找对象; 2.定事件;  3.匿名函数
    $(function (){
        alert('原神启动！！！');
        $('#btnsend').click(function (){
            $.ajax({
                url:'ajaxreq3',
                type:'post',
                data:'{"username":"tom","password":"111"}',
                contentType:'application/json;charset=utf-8',
                success:function (resdata) {        //服务器返回来的数据
                    console.log(resdata);
                }
            });
        });
        //--------------
        $('#btnresp').click(function (){
             alert('尊贵的岩王帝君钟离，欢迎回来');
            $.ajax({
                url:'ajaxresp',
                type:'get',
                data:'',
                contentType:'application/json;charset=utf-8',
                success:function (resdata){  //返回的是一个json对象;解析？
                    console.log(resdata);
                    console.log(resdata.username);
                    console.log(resdata.password);
                    //获取值：后续假如有有一个登陆页面;
                    if(resdata.username==='tom.ma'&& resdata.password==='111'){
                        //...
                    }else
                    {
                        //...
                    }
                }
            });
        });
    });
</script>
<h2>注册信息</h2>
<form>
    <label for="phone">手机号:</label>
    <input type="text" id="phone" name="phone" required><br><br>
    <label for="register_date">注册日期时间:</label>
    <input type="datetime-local" id="register_date" name="register_date" required><br><br>
    <input type="button" id="register_btn" value="注册">
</form>
</body>
</html>
